/*
 * @Description: 首页下拉后的云卡页面
 * @Author: tao.xie
 * @Date: 2019-06-11 10:28:11
 * @Last Modified by: tao.xie
 * @Last Modified time: 2019-06-14 17:33:24
 */
<template>
  <div>
    <bus-card-title-bar
      class="title-bar"
      :needBorder="true"
    />
    <div id="buscardgwtwrapper"></div>
  </div>
</template>

<script>
import BusCardTitleBar from '../components/BusCardTitleBar'
import { isUserLogin } from '@/utils/UserBeanUtils'
export default {
  components: {
    BusCardTitleBar
  },
  data() {
    return {
      buscard: null,
      timer: null,
      isActivated: false
    }
  },
  mounted() {
    // document.addEventListener('buscardReady', () => {
    //   /* eslint-disable */
    //   this.buscard = new gwt4vue.buscard()
    // })

    // const s = document.createElement('script')
    // s.type = 'text/javascript'
    // s.src = './static/js/smartcard/smartcard.nocache.js'
    // document.body.appendChild(s)

    this.timer = setInterval(() => {
      // eslint-disable-next-line no-undef
      if (buscard4vue) {
        window.clearInterval(this.timer)
        /* eslint-disable */
        this.buscard = new buscard4vue.buscard()
      }
    }, 50)

    //添加cordova的生命周期
    document.addEventListener("resume", () => {
      //当云卡页面激活状态且webview的生命周期为resume时，做以下处理
      if (this.isActivated) {
        if (isUserLogin()) {
          //已登陆，调用组件的激活方法
          this._activated()
        } else {
          //为登陆，路由返回
          this.$router.back()
        }
      }
    })
    document.addEventListener("pause", () => {
      //webview的暂停生命周期，当组件处理激活状态时，调用组件的卸载方法
      if (this.buscard && this.isActivated) {
        this.buscard.deactivated()
      }
    })
  },
  activated() {
    this._activated()
  },
  deactivated() {
    this._deactivated()
  },
  methods: {
    _activated() {
      if (this.buscard) {
        this.buscard.activated()
        this.isActivated = true
      }
    },
    _deactivated() {
      if (this.buscard) {
        this.buscard.deactivated()
        this.isActivated = false
      }
    }
  }
}
</script>

<style scoped>
.title-bar {
  background: #fff;
}
</style>
